<template>
	<view class="popup-content">
		<view class="title-row">
			<text style="margin-right: 5px;">{{msg.title}}</text>
			<iconfont :name="msg.icon.avatar" :color="msg.icon.color" :size="25"></iconfont>
		</view>

		<view class="text-row">
			<text>{{msg.content}}!</text>
			<view style="display: block;width: 100%; text-align: end;">
				<text v-if="msg.msgType!=2&&msg.handlerId">——{{msg.handlerName}}已去处理</text>
				<!-- <text v-if="msg.uid">——来自{{msg.inviterName}}的邀请</text> -->
			</view>
		</view>

		<view class="btn-row">
			<view class="btn" hover-class="btn-hover" @click="deleteMsg">
				<uni-icons type="trash" size="25" color="#f53f3f"></uni-icons>
				<text style="color: #f53f3f;">删除</text>
			</view>
			<view class="btn" hover-class="btn-hover" v-if="msg.msgType==0&&!msg.handlerId" @click="gotoHandler(0)">
				<uni-icons type="paperplane" color="#1a74ff" size="25"></uni-icons>
				<text>处理</text>
			</view>
			<view class="btn" hover-class="btn-hover" v-if="msg.msgType==1&&!msg.handlerId" @click="gotoHandler(1)">
				<uni-icons type="cart" color="#1a74ff" size="25"></uni-icons>
				<text>采购</text>
			</view>
			<view class="btn" hover-class="btn-hover" v-if="msg.msgType==2&&!msg.handlerId" @click="gotoHandler(2)">
				<uni-icons type="auth" color="#1a74ff" size="25"></uni-icons>
				<text>同意</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "my-msg-pop",
		props: {
			msg: {}
		},
		data() {
			return {

			};
		},
		methods: {
			// 事件处理
			deleteMsg() {
				this.$emit('delete')
				this.close()
			},
			gotoHandler(type) {
				if (type == 2) {
					uni.$api.fridge.join(this.msg.fid).then(() => {
						uni.$api.message.handle(this.msg.msgId)
						uni.switchTab({
							url: '/pages/home/home'
						})
					})
				} else {
					if (type == 0) {
						uni.switchTab({
							url: '/pages/take_store/take_store'
						})
						uni.setStorageSync('mode', "time")
						uni.setStorageSync('modeIndex', "0")
					}
					uni.$api.message.handle(this.msg.msgId)
				}
				this.close()
			},
			close() {
				this.$emit('close')
			}
		}
	}
</script>

<style lang="scss">
	.popup-content {
		background-color: #fff;
		border-radius: 20rpx;
		padding: 10px 20px;
		width: 450rpx;

		.title-row {
			padding-bottom: 15px;
			display: flex;
			align-items: center;
			font-size: 20px;
		}

		.text-row {
			color: #7a838f;
			text-indent: 2em;
			padding-bottom: 15px;
			font-size: 16px;
			width: 100%;
		}

		.btn-row {
			display: flex;
			color: #1a74ff;
			justify-content: space-evenly;
			font-size: 18px;

			.btn {
				display: flex;
				align-items: center;
				justify-content: center;
				flex: 1;

				>text {
					margin-left: 5px;
				}
			}

			.btn-hover {
				background-color: #f1f1f1;
			}
		}
	}
</style>